<script setup lang="ts">
const toadMsg = useState<string>("toadMsg");
const msg = useState<string>("msg");
const state = reactive({
  id: "",
  password: "",
  new_password: "",
  re_password: "",
});

const userCookie = useCookie<LoginedUser>("user");

const handleSubmit = async () => {
  if (state.new_password === state.password) {
    toadMsg.value = "玩呢？新密码和现用密码一样";
    return;
  }
  if (state.new_password !== state.re_password) {
    toadMsg.value = "两次输入的密码不一致";
    return;
  }
  state.id = userCookie.value.id;

  await $put("/user/change-password", state);
  msg.value = "密码修改成功";
  navigateTo("/account/change-password");
};
</script>

<template>
  <PageTitle>修改密码</PageTitle>

  <Form @submit="handleSubmit">
    <FormInput
      type="password"
      v-model="state.password"
      label="现用密码"
      required
    />
    <FormInput
      type="password"
      v-model="state.new_password"
      label="新密码"
      required
    />
    <FormInput
      type="password"
      v-model="state.re_password"
      label="重复密码"
      required
    />
  </Form>
</template>
